{{!
  Copyright (c) HashiCorp, Inc.
  SPDX-License-Identifier: BUSL-1.1
~}}

<PageHeader as |p|>
  <p.levelLeft>
    <h1 class="title is-3">
      Authentication Methods
    </h1>
  </p.levelLeft>
</PageHeader>

<Toolbar>
  <ToolbarFilters>
    <SearchSelect
      @id="filter-by-auth-type"
      @options={{this.authMethodArrayByType}}
      @selectLimit="1"
      @disallowNewItems={{true}}
      @fallbackComponent="input-search"
      @onChange={{this.filterAuthType}}
      @placeholder={{"Filter by auth type"}}
      @displayInherit={{true}}
      @inputValue={{if this.selectedAuthType (array this.selectedAuthType)}}
      @disabled={{if this.selectedAuthName true false}}
      class="is-marginless"
    />
    <SearchSelect
      @id="filter-by-auth-name"
      @options={{this.authMethodArrayByName}}
      @selectLimit="1"
      @disallowNewItems={{true}}
      @fallbackComponent="input-search"
      @onChange={{this.filterAuthName}}
      @placeholder={{"Filter by auth name"}}
      @displayInherit={{true}}
      @inputValue={{if this.selectedAuthName (array this.selectedAuthName)}}
      class="is-marginless has-left-padding-s"
    />
  </ToolbarFilters>
  <ToolbarActions>
    <ToolbarLink @route="vault.cluster.settings.auth.enable" @type="add" data-test-auth-enable>
      Enable new method
    </ToolbarLink>
  </ToolbarActions>
</Toolbar>

{{#each (this.sortMethods this.authMethodList) as |method|}}
  <LinkedBlock
    @params={{array "vault.cluster.access.method" method.id}}
    class="list-item-row"
    data-test-auth-backend-link={{method.id}}
  >
    <div class="level is-mobile">
      <div class="level-left">
        <div>
          <Hds::TooltipButton @text={{method.methodType}} aria-label="Type of auth mount">
            <Icon @name={{method.icon}} class="has-text-grey-light" />
          </Hds::TooltipButton>
          <span data-test-path data-test-id={{method.id}} class="has-text-weight-semibold has-text-black">
            {{method.path}}
          </span>
          <br />
          <code class="has-text-grey is-size-8">
            {{method.accessor}}
          </code>
        </div>
      </div>
      <div class="level-right is-flex is-paddingless is-marginless">
        <div class="level-item">
          <Hds::Dropdown @isInline={{true}} @listPosition="bottom-right" as |dd|>
            <dd.ToggleIcon
              @icon="more-horizontal"
              @text="Overflow options"
              @hasChevron={{false}}
              data-test-popup-menu-trigger
            />
            <dd.Interactive
              @text="View configuration"
              @route="vault.cluster.access.method.section"
              @models={{array method.id "configuration"}}
            />
            {{#if (or method.canEdit (and (eq method.methodType "aws") method.canEditAws))}}
              <dd.Interactive
                @text="Edit configuration"
                @route="vault.cluster.settings.auth.configure"
                @model={{method.id}}
              />
            {{/if}}
            {{#if (and (not-eq method.methodType "token") method.canDisable)}}
              <dd.Interactive @text="Disable" @color="critical" {{on "click" (fn (mut this.methodToDisable) method)}} />
            {{/if}}
          </Hds::Dropdown>
        </div>
      </div>
    </div>
  </LinkedBlock>
{{/each}}

{{#if this.methodToDisable}}
  <ConfirmModal
    @color="critical"
    @confirmTitle="Disable method?"
    @confirmMessage="This may affect access to Vault data."
    @onClose={{fn (mut this.methodToDisable) null}}
    @onConfirm={{perform this.disableMethod this.methodToDisable}}
  />
{{/if}}